<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style>
	body,html{
		margin: 0 auto;
		height:100%;
		width:100%;
	}
</style>
<script type="text/javascript">
	var comChart = {
			"title":{
				"text":"线图---柱图",
				"style":"{font-size:12px;color:#bb9ca8}"
			},
			"x_legend":{
				"text":"本期统计数据与上期统计数据对比",
				"style":"{font-size:12px;color:#661ca8}"
			},
			"legend":{"position":"right", "visible":true, "bg_colour" : "#FAFAFA"},
			"bg_colour":"#ffffff",
			"elements":[
			   	{
					"type":"bar_3d",
					"colour":"#91fa91",
					"text":"当日事件(条)",
					"barwidth":0.5,
					"key-on-click":"toggle-visibility",
					"on-show":{"type":"grow-up","cascade":"1"},
					"values":[2,7,14,1]
					//"values":[]
				},
				{
					"type":"line",
					"colour":"#cc0000",
					"text":"昨日事件(条)",
					"width":2,
					"dot-style": {
						"type":"solid-dot", 
						"colour":"#0000ff", 
						"dot-size": 4,
						"tip":"#val#<br>#x_label#" 
						},
					"key-on-click":"toggle-visibility",
					"halo-size": 1,
					"on-show":{"type":"shrink-in","cascade":"2"},
					//"values":[]
					"values":[4,2,12,13]
				}
			],
			 "x_axis":{
				    "stroke":       1,
				    "tick_height":  10,
				    "colour":      "#d000d0",
				    "grid_colour": "#00ff00",
				    "labels": {
				      "labels": ["一月","二月","三月","四月"]
				    },
				    "3d": 5
				   },
			"y_axis":{
				"stroke":2,
				"steps":3,
				"min":0,
				"max":20,
				"offset":0
			}
	};
	
	function getComDatas(){

		$.ajax({
			type:"get",
			url:"ContactChartView!barAndLineValueTest",
			dataType:"json",
			success : function(msg){
				comChart.elements[0].values = eval(msg.barValueStr);
				comChart.elements[1].values = eval(msg.lineValueStr);
				if(isReload){
					loadDatas("assembleChart",comChart);				
				}
				setTimeout("getComDatas()",3000);
			},
			error : function(){
				
			}
		});
	}
	function getAssembleDatas(){
		getComDatas();
		isReload = true;
		//comChart.elements[0].values=[1,2,3,4];
		return JSON.stringify(comChart);
	}
</script>
<script type="text/javascript">
	var otherBar_C = {
			"bg_colour":"#FFFFFF",
			"elements":[{
		        "type":      "line",
		        "text":		"线图",
		        "alpha":     0.5,
		        "colour":    "#FF0000",
		        "values" :   [6,5,9],
		        "dot-size":5,
		        "dot-style": {//点的样式
					"type":"anchor",//anchor为多边形类型
					"sides":3,//边的个数
					"width":1,//边的粗细
					"tip":"type = anchor\n sides = 3\n hollow" //鼠标提示信息
				},
				"line-style":	{//线的样式
					"style":"dash",//虚线，默认为solid
					"on":4,//虚线长度
					"off":4//空白长度
				},
				"on-show":{
					"type": "shrink-in", //显示方式
					"cascade":1, //定义优先级，值越小，优先级越高
					"delay":0//延迟时间
				}
		      },{
			        "type":      "line",
			        "text":		"线图",
			        "alpha":     0.5,
			        "colour":    "#00FF00",
			        "values" :   [1,4,8,3,2],
			        "dot-size":5,
			        "dot-style": {//点的样式
						"type":"star"
					},
					"on-show":{
						"type": "mid-slide", //显示方式
						"cascade":1, //定义优先级，值越小，优先级越高
						"delay":0//延迟时间
					}
			      },{
				        "type":      "line",
				        "text":		"线图",
				        "alpha":     0.5,
				        "colour":    "#0000FF",
				        "values" :   [8,2,5,10,7,15],
				        "dot-size":5,
				        "dot-style": {//点的样式
							"type":"dash"
						},
						"line-style":	{//线的样式
							"style":"dash",//虚线，默认为solid
							"on":4,//虚线长度
							"off":4//空白长度
						},
						"on-show":{
							"type": "shrink-in", //显示方式
							"cascade":1, //定义优先级，值越小，优先级越高
							"delay":0//延迟时间
						}
				      }],
			"x_axis":{
				"stroke":1,
				"offset":true,
				"tick-height":10,
				"colour":"#E6E6F6",
				"grid-visible":false
			},
			"y_axis":{
				"stroke":1,
				"offset":false,
				"tick-length":10,
				"colour":"#E6E6F6",
				"grid-visible":false
			}
			
	};

	function initOtherBar(){
		return JSON.stringify(otherBar_C);
	}
	$(document).ready(function(){
		swfobject.embedSWF("${pageContext.request.contextPath}/js/ofc/ofcSwf/open-flash-chart.swf","line","100%","100%","9.0.0","expressInstall.swf",{"get-data":"initOtherBar"},{"wmode":"transparent","quality":"hight"});
		
	});
</script>
</head>
<body>
<div id="" style="width:100%;height:100%;overflow: hidden;" class="divfrist">
			<DIV id="" style="width:100%;height:0.7%;overflow:hidden;"></DIV>
			<DIV id="" style="width:100%;height:98.6%;">
					<DIV id="" class="" style="float:left;width:0.4%;height:100%;overflow:hidden;"></DIV>
					<DIV id="" class="" style="float:left;width:48.8%;height:100%;">
							<DIV id="" class="allborder" style="width:100%;height:100%;max-height:100%;max-width:100%;overflow:auto;">
							   <!--内容区 -->
										<div id="assembleChart"></div>
							   <!--内容区 -->
							</DIV>
					</DIV>
					<DIV id="" class="" style="float:left;width:0.4%;height:100%;overflow:hidden;"></DIV>
					<DIV id="" class="" style="float:left;width:50%;height:100%;">
							<DIV id="" class="allborder" style="width:100%;height:100%;max-height:100%;max-width:100%;">
								<!-- 内容区 -->
									<div id="line" style="border:1px solid #cccccc;height:100%;width:100%;">
										 
								<!-- 内容区 -->
							</DIV>
					</DIV>
					<DIV id="" class="" style="float:left;width:0.37%;height:100%;overflow:hidden;"></DIV>
			</DIV>
			<DIV id="" class="div_bottom"></DIV>
	</div>
	<script type="text/javascript">
		swfobject.embedSWF("${pageContext.request.contextPath}/js/ofc/ofcSwf/open-flash-chart.swf", "assembleChart", "450", "450", "9.0.0","expressInstall.swf",{"get-data":"getAssembleDatas"});
	</script>
</body>
</html>